<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useThree } from "@/hooks/useThree";
import LightControl from "./LightControl.vue";

const containerRef = ref<HTMLElement | null>(null)
const { init, onResize, scene } = useThree(containerRef);

onMounted(() => {
    init()
    window.addEventListener("resize", onResize);
})
</script>

<template>
    <LightControl :scene='scene' />
    <div class="w-full h-full" ref="containerRef"></div>
</template>

<style scoped></style>